User Panel:

 

Buyer Credentials:

  • Email: buyer@example.com
  • Password: Pass@123

Trade Seller Credentials:

  • Email: tradeseller@yopmail.com
  • Password: Pass@123

Private Seller Credentials:

  • Email: privateseller@yopmail.com
  • Password: Pass@123

 

Sign Up

The sign-up process begins with a profile selection screen where users choose between 'Buyer' and 'Seller' profiles.

  • Profile Selection:
    • Users are presented with two options: 'Buyer' and 'Seller'.
    • Selecting either option leads to a profile-specific registration form.
  • Buyer Sign Up Form:
    • The buyer registration form includes the following fields:
      • First Name
      • Last Name
      • Email Address
      • Contact Phone Number
      • Password
      • reCAPTCHA for security
  • Seller Sign Up Form:
    • The seller registration form includes all the fields from the buyer form, with an additional dropdown menu: 'Trade Seller/Dealers'.
      • First Name
      • Last Name
      • Email Address
      • Contact Phone Number
      • Password
      • Trade Seller/Dealers (Dropdown)
      • reCAPTCHA for security

Key Features:

  • Profile Selection: Users choose between buyer and seller profiles.
  • Standard Information: Both forms collect basic user information.
  • Seller-Specific Field: The seller form includes a 'Trade Seller/Dealers' dropdown.
  • Security: reCAPTCHA is used on both forms.

Sign In

This page provides a login form for existing users, allowing them to sign in with their email and password, along with options for social login via Google and Facebook.

Description:

This page presents a "Get Started with CarQuest" module focused on user login. It features a tabbed interface with "Log In" currently active. The login form includes fields for users to enter their "Email" and "Password." A "Forgot Password?" link is available for users who need to recover their login credentials. For security, an "I'm not a robot" reCAPTCHA is implemented before the "Log in" button. Additionally, the page offers alternative login methods through "Or Log In With" options for Google and Facebook, providing users with convenient social login choices.

Key Features:

  • Email and Password Login: Standard fields for email and password authentication.
  • Forgot Password Recovery: A link to initiate the password recovery process.
  • Security reCAPTCHA: Protects the login form from automated bots.
  • Social Login Options: Allows users to sign in using their Google or Facebook accounts.
  • Clear "Log In" Button: A prominent button to submit login credentials.
  • "Sign Up" Option: A separate tab indicates the availability of a user registration form.

 

 

Home Page

The homepage is the entry point to an automotive marketplace for buying and selling new and used cars, bikes, and spare parts. It immediately showcases top deals and the latest listings across all categories. The page also provides information on how the platform works, highlights popular brands, and encourages mobile app usage for enhanced accessibility.

Key Features:

  • Centralized Automotive Marketplace: Provides a single point of access for buying and selling cars, bikes, and spare parts.
  • Featured Deals: Highlights the best current offers on new and used cars to attract buyers.
  • Recent Listings Showcase: Displays the newest additions across all categories (cars, bikes, spare parts) for immediate visibility.
  • Popular Brands Directory: Offers a quick overview of available vehicles and parts by popular manufacturers.

 

Buy Page

The "Buy" section of the platform is designed to provide a comprehensive and user-friendly experience for individuals looking to purchase vehicles (cars and motorbikes) and spare parts. It employs a consistent layout across its sub-sections (Cars, Motorbike, and Spare Parts), ensuring ease of navigation and a familiar user experience. Each sub-section features a prominent search functionality with relevant filters and showcases both featured deals and recent listings.

Key Features (Across all "Buy" sub-menu):

  • Dedicated Search Functionality: Each sub-section offers a specific search bar tailored to finding cars, motorbikes, or spare parts.
  • Relevant Filtering Options: Each search interface includes filters pertinent to the specific category (e.g., vehicle type, make, model, condition, location).
  • Featured Deals Showcase: A section highlighting the "Best Deals This Month" for each category, drawing attention to attractive offers.
  • "Recently Posted" Listings: A dynamic display of the newest additions in each category, ensuring users see the latest inventory.
  • Clear Listing Information: Each listing provides essential details such as a placeholder image, make/model/description, and price.
  • Tabbed Navigation: The "Buy" section utilizes a tabbed interface (Cars, Motorbike, Parts) allowing users to seamlessly switch between different product categories.

"Buy Cars" Page Specifics:

  • Focuses on new and used car listings.
  • Offers advanced car-specific filters (e.g., body type).

"Buy Motorbike" Page Specifics:

  • Focuses on new and used motorbike listings.
  • Includes motorbike-specific filters (e.g., Locally Used, Foreign Used).

"Buy Spare Parts" Page Specifics:

  • Focuses on new and used spare parts for both cars and motorbikes.
  • Provides spare part-specific filters (e.g., condition).

 

 

Sell Page

The "Sell" menu provides users with the ability to list their cars, motorbikes, and spare parts for sale on the platform. Access to this functionality is conditional:

  • Non-logged-in users: Attempting to access any of the "Sell" sub-menus will redirect them to the Login Page.
  • Logged-in Buyers: Users logged in with a buyer account will be redirected to a page prompting them to "Register as a seller" ( "Do you want to sell a product? Please register as a seller").
  • Logged-in Sellers: Users logged in with a seller account (or after registering as one) will be able to access the "Add a Product" forms for Cars, Motorbikes, and Parts.

Add a Product Workflow:

The process for listing a product for sale follows a multi-step workflow indicated by the progress bar at the top of the "Add a Product" pages: Details -> Amount -> Add Photo -> Preview. The first step, "Details," requires users to input specific information about the item they wish to sell.

1. "Add a Product" - Cars:

  • Vehicle Type: Pre-selected as "Car" with a non-editable dropdown.
  • Title: A mandatory field for the listing title.
  • Condition: A dropdown menu to specify the car's condition.
  • Post Url (Optional): A field to include a URL related to the car.
  • Vehicle Specification: A section with various dropdown menus and fields to specify details such as:
    • Brand
    • Model
    • Year of Manufacture
    • Registration Date (with a date picker)
    • Fuel Type
    • Select Engine Size
    • Seats
    • Select Body Type
    • Color
    • Transmission
    • Service History
    • Alloy Wheels
    • Owner
    • Mileage
    • Registration Number
    • 0 years old (ndicating age if new)
  • Features: A text area to list key features of the car.
  • Description: A larger text area for a detailed description of the car.
  • Location: Dropdown menus to select the State and Location, and a field to enter the specific Address.
  • Navigation: "Previous" and "Next" buttons to navigate through the "Add a Product" steps.

2. "Add a Product" - Motorbikes:

  • Vehicle Type: Pre-selected as "Motorbike" with a non-editable dropdown.
  • The form includes similar fields to the "Cars" form but tailored for motorbikes, such as "Select Body Type" and omitting car-specific fields like "Seats" and "Alloy Wheels." The "0 years old" field is also present.

3. "Add a Product" - Spare Parts:

  • Spare Parts Type: Pre-selected as "Spare Parts" with a non-editable dropdown.
  • The form includes fields relevant to spare parts, such as:
    • Brand
    • Model
    • Year of Manufacture
    • To Year (likely indicating compatibility range)
    • Part Category
    • Parts Id
    • Parts Name
    • Parts For (likely indicating the vehicle make/model the part is for)
  • It also includes common fields like Title, Condition, Post Url, Description, and Location.

Key Features of the "Sell" Functionality:

  • Conditional Access: Requires users to be logged in and registered as a seller.
  • Category-Specific Forms: Provides tailored "Add a Product" forms for Cars, Motorbikes, and Spare Parts, ensuring relevant information is captured for each category.
  • Multi-Step Listing Process: Guides sellers through a structured process (Details -> Amount -> Add Photo -> Preview) to create comprehensive listings.
  • Detailed Product Information: Offers a wide range of fields to capture specific attributes for each product type, enhancing listing quality and searchability.
  • Location-Based Listings: Includes location fields to help buyers find products in their vicinity.

 

 

Sell Details Page

This page provides detailed information about a specific vehicle listing, including its title, price, mileage, images, overview, tags, and related listings from the same seller and similar options.

Description:

This page offers a comprehensive view of a single vehicle listing (e.g., "BLACK TOYOTA SIENNA SE 2014"). It displays the vehicle's title, price, mileage, and multiple images. A "Seller Details" section shows information about the seller. The "Vehicle Overview" highlights key specifications with icons. "Tags" provide relevant keywords. Sections like "Cars in the Same Price Range," "Cars by the Same Brand," and "Others to Offer by the Dealer" showcase related listings. Users can also inquire about the car.

Key Features:

  • Detailed vehicle information (title, price, mileage).
  • Multiple images of the vehicle.
  • Seller details.
  • Key specifications overview.
  • Relevant tags for the vehicle.
  • Listings of similar cars based on price and brand.
  • Other offerings from the same dealer.
  • Inquiry option.

 

 

Import Page

The "Find New and Used Import Cars" page, one of three menus (Cars, Motorbike, Spare Parts) in the "Import" section, features a search bar with filters for imported cars, highlighting deals and recently posted import vehicles.

Description:

This page focuses on finding imported cars within the "Import" section. It has a prominent search bar with options to filter by "New" or "Foreign Used" cars, along with other criteria like make, model, price, and location. The page also showcases "Best Car Deals This Month" and "Recently Posted Car" listings specifically for imported vehicles.

Key Features:

  • Search for new and used import cars.
  • Specific filters for imported vehicles.
  • Highlights deals on import cars.
  • Shows recently posted import cars.
  • Part of the "Import" section with "Cars," "Motorbike," and "Spare Parts" menus.

 

Compare Vehicle Page

The "Vehicle Compare" page allows users to compare the specifications and features of up to three different vehicles side-by-side. It provides three entry points for users to add the vehicles they wish to compare.

Description:

The "Vehicle Compare" page is designed to help users make informed decisions by allowing them to compare the details of multiple vehicles. The layout is straightforward, presenting three clearly delineated sections. Within each section, a prominent "+ Add a vehicle" button serves as the primary interaction point. Clicking this button likely opens a modal or navigates the user to a search or selection interface where they can choose a vehicle from the platform's listings. Once vehicles are selected, this page would presumably display their specifications, features, pricing, and other relevant details in a comparative format, making it easy for users to identify the differences and similarities between their chosen vehicles.

Key Features:

  • Multi-Vehicle Comparison: Enables users to compare up to three different vehicles simultaneously.
  • Clear Entry Points: Provides three distinct "+ Add a vehicle" buttons for easy selection.
  • Intuitive Design: Suggests a user-friendly interface for selecting and viewing vehicle comparisons.
  • Enhanced Decision Making: Aims to facilitate informed purchasing decisions by presenting vehicle information in a comparative format.

 

 

Car valuation Page

Summary:

The "Car Valuation" page offers a free service to estimate the value of a car based on user-provided details such as make, model, year, and location. It also explains the benefits of car valuation for both buyers and sellers and provides quick links to the "Buy" and "Sell" sections, along with featured car deals.

Description:

The primary function of the "Car Valuation" page is to provide users with an estimated market value for their vehicles or a vehicle they are interested in. This is facilitated through a prominent "Free Car Valuation" form located at the top left of the page. Users are required to select the car's make, model, year of manufacture, and location to receive an estimated valuation by clicking the "Get Car Valuation" button.

The page also aims to educate users on the importance of car valuation. It presents two common scenarios: for buyers, understanding a car's value helps in negotiations and ensures a fair price; for sellers, it assists in setting a competitive and realistic asking price. Clear explanations and relevant visuals accompany these scenarios.

To further engage users, the page includes direct links to the platform's core functionalities with "Buy a Car" and "Sell your Car" buttons. Additionally, a section showcasing "Good car deals this month" provides examples of current listings, potentially influencing users who are looking to buy.

Key Features:

  • Free Car Valuation Tool: Allows users to get an estimated value for a car by providing key details (make, model, year, location).
  • Benefits Explanation: Clearly outlines the advantages of using car valuation for both buying and selling perspectives.
  • Direct Links to Buy and Sell: Provides quick access to the platform's main marketplaces.
  • Featured Car Deals: Showcases current attractive car listings.
  • Informative Layout: Combines a valuation tool with educational content and relevant listings to guide users.

 

 

Favourite page

The "Favourite" page lets logged-in users save and view their favorite car, bike, and spare parts listings, organized by tabs. A search bar helps filter saved items.

Description:

This page is where users can find listings they've marked as favorites. It's organized into "Cars," "Bikes," and "Spare Parts" tabs for easy browsing. A search bar is available to quickly locate saved items.

Key Features:

  • Save favorite listings.
  • Organized by Cars, Bikes, Parts tabs.
  • Search within saved items.
  • Central hub for preferred listings.

 

About us page 

CarQuest's "About Us" page introduces it as a leading digital marketplace for buying and selling vehicles and parts, connecting buyers and sellers nationwide.

Description:

This page explains that CarQuest is a top online platform for automotive transactions. It connects buyers with a wide range of sellers for cars and parts, leveraging market data to empower retailers. The page also promotes their mobile app.

Key Features:

  • Leading digital automotive marketplace.
  • Connects buyers and sellers nationally.
  • Empowers retailers with market data.
  • Promotes mobile app for users.

 

Contact Us Page

The "Contact Details" page provides users with various ways to get in touch with CarQuest, including their main office address, phone numbers (with WhatsApp), email, and a contact form for sending direct messages.

Description:

This page provides CarQuest's contact information, including their office address, phone numbers for calls and WhatsApp, and email. A contact form allows users to send direct inquiries.

Key Features:

  • Multiple contact methods provided.
  • Direct messaging via contact form.
  • Clear and organized contact information.
  • Includes security reCAPTCHA.
  • App download promoted.

 

Blog page 

The "Welcome to CarQuest Car Blog" page features articles related to cars, maintenance, and the buying/selling process. It includes a search function, sections for latest and featured posts, trending topics, and a link to view all blog posts.

Description:

This page serves as the central hub for CarQuest's blog content. It greets users with a welcoming message and a brief description of the blog's focus on providing helpful information about cars. A prominent search bar allows users to find specific blog articles. The layout includes sections highlighting the "Latest Blog Posts," "Featured Blog Post," and "Trending" articles, providing quick access to popular and recent content. A "View All Blog Posts" link encourages users to explore the complete archive.

Key Features:

  • Informative Car-Related Articles: Offers blog posts about car maintenance, buying, and selling.
  • Blog Search Functionality: Enables users to search for specific topics within the blog.
  • Latest Posts Section: Displays the most recently published blog articles.
  • Featured Post Highlight: Showcases a selected or important blog article.
  • Trending Topics: Presents popular or currently relevant blog content.
  • Link to Full Blog Archive: Provides access to all published blog posts.

 

FAQ page 

The FAQ page answers common questions and includes a search bar for easy navigation.

Description:

This page provides a list of frequently asked questions and their corresponding answers. Users can utilize the search bar to quickly find information on specific topics.

Key Features:

  • Answers to common user inquiries.
  • Search functionality for FAQs.
  • Clear question and answer presentation.
  • Option for further assistance.

 

Search Result page 

The search results page for spare parts displays featured listings in a grid layout with a filtering sidebar to refine results by category, price, condition, brand, and location.

Description:

This page presents the results for a spare parts search. The main content area features a grid of "Featured Used Spare Parts" listings, each showing a placeholder image, a brief description, price, and location. On the left, a comprehensive sidebar offers various filters. Users can adjust the price range using a slider or input fields, select the condition of the parts, filter by specific brands using checkboxes, and narrow down results by location. The "Category" filter is also present, likely pre-set to "Spare Parts" for this specific page.

Key Features:

  • Grid Layout for Listings: Displays search results in an easily scannable grid.
  • Comprehensive Filtering: Offers multiple filters (price, condition, brand, location) to narrow down search results.
  • Clear Listing Information: Each result includes a placeholder image, description, price, and location.
  • Category Specific: The page is focused on displaying spare parts listings.

 

Buyer profile

The buyer profile/dashboard displays personal information, allows editing, provides a seller account switch option, and offers navigation to other platform sections.

Description:

This page shows the buyer's personal details and allows them to make changes. It also provides the functionality to switch to a seller account and offers links to the dashboard, mail, and chatbox.

Key Features:

  • Display personal information.
  • Edit profile details.
  • Switch to a seller account.
  • Navigation to dashboard, mail, chatbox.

Mail page 

The "Mail" section displays the user's inbox with received emails, showing sender, type, subject, and creation date. It allows marking emails as read and navigating to sent emails.

Description:

This page shows the user's "Inbox," listing received emails with details like sender, email type, subject, and the date they were created. There's an option to mark selected emails as "Read" and a "Done" button to apply the action. The sidebar provides navigation to the "Inbox" (with a notification for one unread message) and "Sent" emails.

Key Features:

  • Displays received emails in an inbox.
  • Shows sender, type, subject, and date.
  • Option to mark emails as read.
  • Navigation to inbox and sent emails.

 

Chatbox page 

The "Chatbox" page displays a message prompting the user to select a chat to begin or continue a conversation. It includes a search bar to find existing chats.

Description:

This page presents the "Chatbox" feature. The main area displays a message: "Select a chat to continue conversation," indicating that no chat is currently selected or active. A search bar labeled "Search Chats" is available on the left, allowing users to find specific conversations. The sidebar also provides navigation to the "Dashboard" and "Mail."

Key Features:

  • Displays a prompt to select a chat.
  • Includes a search bar to find chats.
  • Provides navigation to other sections.

 

Change password page

The "Change Password" page allows users to update their password by entering their old password, a new password, and confirming the new password.

Description:

This page provides a form for users to change their account password. It includes fields for "Old Password," "New Password," and "Confirm Password," each with a toggle to show or hide the entered text. A "Change Password" button is present to submit the changes. The sidebar navigation remains visible.

Key Features:

  • Fields for old, new, and confirm password.
  • Toggle to show/hide password.
  • "Change Password" submission button.
  • Standard sidebar navigation.

 

Seller profile page 

The seller profile page displays and allows editing of personal and business information, including contact details, address, business name, website, and operating hours.

Description:

This page shows the profile for a seller. It has sections for "Personal Information" and "Business Information," both with "Edit" buttons. Personal information includes name, contact details, and address. Business information includes the business name, phone number, WhatsApp number, website URL, seller page URL, address, and operating hours with day and time selection. The left sidebar provides navigation.

Key Features:

  • Displays personal and business details.
  • Allows editing of profile information.
  • Includes fields for business-specific details.
  • Option to set operating hours.
  • Standard sidebar navigation.

 

Seller dashboard

Seller Dashboard Overview:

The seller dashboard provides a central overview of the seller's activity, including quick statistics on their listings, recent adverts, and a summary of all adverts. It also offers a "Reporting" section for more detailed performance analysis.

Dashboard Tab:

Summary:

The "Dashboard" tab displays key statistics for the seller's listings (cars, motorbikes, spare parts), recent posted adverts, a summary of all adverts, and a quick action button to post a new advert.

Description:

This tab presents a snapshot of the seller's current status. At the top, it shows the number of active listings for "Car," "Motorbike," and "Spare Parts." A prominent "Post New Advert" button allows sellers to quickly create new listings. The "Products Statistics" section provides a visual representation of total posts per month. Below, "Recently Posted Adverts" are displayed with images and brief details. Finally, the "All Adverts" section lists all the seller's adverts with details like name, type, date posted, date sold, status, and amount, with a "See All" link for more details.

Key Features (Dashboard):

  • Quick statistics on car, motorbike, and spare parts listings.
  • "Post New Advert" shortcut.
  • Visual representation of monthly post statistics.
  • Display of recently posted adverts.
  • List of all adverts with key details and a "See All" option.

 

Reporting Tab:

Summary:

The "Reporting" tab offers visual data on the performance of the seller's adverts, including views, impressions, vehicles sold, mails received, and most viewed cars.

Description:

This tab provides insights into the performance of the seller's listings through various charts and graphs. It displays data for "Views," "Impressions," "Vehicle Sold," and "Mails" over different timeframes (Year, Month, Week). Each metric has its own graph and an "Export" option. Additionally, a pie chart shows the "Most Viewed Cars" with their respective percentages.

Key Features (Reporting):

  • Visual data on advert views.
  • Tracking of advert impressions.
  • Reporting on the number of vehicles sold.
  • Statistics on received mails.
  • Chart showing most viewed car listings.
  • Time-based filtering (Year, Month, Week) for most metrics.
  • Export functionality for reporting data.

 

Seller products page 

Summary:

Lists all seller adverts with key details, allows status updates, deletion, and filtering.

Description:

Shows all the seller's listings with details. Sellers can change the status, delete listings, and filter the view.

Key Features:

  • Lists all adverts.
  • Shows key details.
  • Update listing status.
  • Delete listings.
  • Filter adverts.